<template>
    <div class= 'surgeryRecord'>
        <div class = 'sectionBox' ref="sectionBox">
            <h2>
                <span>预约信息</span>
            </h2>
            <div class="box">
                <div class= 'header'>
                    <el-row :gutter="20">
                        <el-col :span="6"><div>预约单号：{{appointment.appointNo}}</div></el-col>
                        <el-col :span="6"><div>申请人： {{appointment.createId}}</div></el-col>
                        <el-col :span="6"><div>申请时间：{{appointment.createTime}}</div></el-col>
                        <el-col :span="6" :align='"right"'><div style='color: #409EFF;'>当前状态: &nbsp;{{appointment.appointmentStatus}}</div></el-col>
                    </el-row>
                </div>
                <div class="title">
                    拟手术信息
                </div>
                <el-row :gutter="20">
                    <el-col :span="6"><div>拟手术名称：{{appointmentRel.operationName}}</div></el-col>
                    <el-col :span="6"><div>拟主刀医生： {{appointmentRel.doctorName}}</div></el-col>
                    <el-col :span="6"><div>联系方式：{{appointmentRel.doctorTel}}</div></el-col>
                    <el-col :span="6"><div>手术助理：{{appointmentRel.asstDoctorIds}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>侧          别：{{appointmentRel.operationSide}}</div></el-col>
                    <el-col :span="6"><div>体          位: {{appointmentRel.operationPosition}}</div></el-col>
                    <el-col :span="6"><div>部位：{{appointmentRel.bodyPosition}}</div></el-col>
                    <el-col :span="6"><div>切口等级：{{appointmentRel.incisionLevel}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>备          血：{{appointmentRel.preparedBlood}}</div></el-col>
                    <el-col :span="6"><div>特殊感染: {{appointmentRel.specialInfected}}</div></el-col>
                    <el-col :span="6"><div>特殊要求：{{appointmentRel.specialRequirement}}</div></el-col>
                    <el-col :span="6"><div>指导医生：{{appointmentRel.guideDoctorName}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>常服抗凝药：{{appointmentRel.isNormalDrug}}</div></el-col>
                    <el-col :span="6"><div>种     类: {{appointmentRel.normalDrugType}}</div></el-col>
                    <el-col :span="6"><div>需术前停药：{{appointmentRel.stopDays}}</div></el-col>
                    <el-col :span="6"><div>肝炎相关抗原：{{appointmentRel.hepatitisAntigenType}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>植入物：{{appointmentRel.implantType}}</div></el-col>
                    <el-col :span="6"><div>术前诊断: {{appointmentRel.beforeDiagnosis}}</div></el-col>
                    <el-col :span="6"><div>术前其他诊断：{{appointmentRel.otherDiagnosis}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>拟手术时间：{{appointmentRel.schedule}}&nbsp;{{appointmentRel.scheduleAmpm}}</div></el-col>
                    <el-col :span="6"><div>拟手术间: {{appointmentRel.wardName}}</div></el-col>
                    <el-col :span="6"><div>拟接收病房：{{appointmentRel.wardName}}</div></el-col>
                    <el-col :span="6"><div>拟床位号：{{appointmentRel.wardBedNo}}</div></el-col>
                </el-row>
                <el-row :gutter="20">
                    <el-col :span="6"><div>拟行麻醉：{{appointmentRel.anesthetistType}}</div></el-col>
                    <el-col :span="6"><div>ASA评级: {{appointmentRel.asaLevel}}</div></el-col>
                    <el-col :span="6"><div>麻醉医生：{{appointmentRel.anesthetistName}}</div></el-col>
                    <el-col :span="6"><div>麻醉医生电话：{{appointmentRel.anesthetistTel}}</div></el-col>
                </el-row>
            </div>

            <h2>
                <span>手术信息</span>
            </h2>
            <div class="box">
                <div class= 'header'>
                    <el-row :gutter="20">
                        <el-col :span="6"><div>手术单号：{{operationInfo.operationNo}}</div></el-col>
                        <el-col :span="6"><div>发送人： {{operationInfo.sender}}</div></el-col>
                        <el-col :span="6"><div>发送时间：{{operationInfo.sendTime}}</div></el-col>
                    </el-row>
                </div>
                <surgery-info :operationInfo="operationInfo"></surgery-info>
            </div>

            <h2>
                <span>手术路径文档</span>
            </h2>
            <div class="box">
                <data-check :appointment = 'appointment' :dataList="dataList"></data-check>
            </div>
        </div>

    </div>
</template>
<script>
import surgeryInfo from '@/yimiviews/case/surgeryInfo'
import dataCheck from '@/yimiviews/components/dataCheck'
import { readCheckList, checkDetail } from '@/api/appointmentManage/check'
import _ from 'lodash'
export default {
  components: { surgeryInfo, dataCheck },
  props: {
    appointment: {
    },
    appointmentRel: {
    },
    operationInfo: {
    }
  },
  data() {
    return {
      dataList: [
        { id: null, materialFromType: 0, materialName: 0, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 0, materialName: 1, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 0, materialName: 2, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 0, materialName: 3, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 0, materialName: 4, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 1, materialName: 5, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 1, materialName: 6, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 1, materialName: 7, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 1, materialName: 8, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 2, materialName: 9, isChecked: 0, note: '', isPrinted: 0 },
        { id: null, materialFromType: 3, materialName: 10, isChecked: 0, note: '', isPrinted: 0 }
      ]
    }
  },
  mounted() {
    var CH = document.body.offsetHeight
    this.$refs.sectionBox.style.height = CH - 260 + 'px'
  },
  created() {
    this.getDataList()
  },
  methods: {
    getDataList() {
      readCheckList(this.dataList).then(res => {
        if (res.data.list.length > 0) {
          this.dataList = JSON.parse(JSON.stringify(_.forEach(this.dataList, data => {
            const result = _.find(res.data.list, { materialFromType: data.materialFromType, materialName: data.materialName })
            if (result) {
              data.materialFromTypeShow = result.materialFromTypeShow
              data.materialNameShow = result.materialNameShow
            }
            return data
          })))
        }
      }).then(x => {
        checkDetail(this.$route.params.id).then(res => {
          if (res.data.list.length > 0) {
            this.dataList = JSON.parse(JSON.stringify(_.forEach(this.dataList, data => {
              const result = _.find(res.data.list, { materialFromType: data.materialFromType, materialName: data.materialName })
              if (result) {
                data.isChecked = result.isChecked
                data.isPrinted = result.isPrinted
              }
              return data
            })))
          }
        })
      })
    }
  }
}
</script>
<style lang="scss" scoped>
@import '../../styles/case.scss';
    .header{
        background-color: #f0f2f5;
        padding:10px;
        margin:-20px -10px 10px;
        font-weight: 500;
        color: #000;
    }
    .title{
        padding: 15px 0;
        color: #333;
    }
    .el-row{
        padding: 5px 0;
    }
</style>


